<template>
  <el-dialog :title="tieleName" :visible.sync="dialogVisible" :close-on-click-modal="false"
             :close-on-press-escape="false" :before-close="handleClose" @close="$emit('update:visible',false)">
    <el-form :model="editForm" label-width="100px" ref="editForm" v-if="editForm">
      <div v-if="pageType==1">
        <el-form-item label="投票内容：">
          {{editForm.vote_name}}
        </el-form-item>
        <el-form-item label="开始时间：">
          {{editForm.created}}
        </el-form-item>
        <el-form-item label="结束时间：">
          {{editForm.end_time}}
        </el-form-item>
        <el-form-item label="参加对象：">
          <div style="max-height: 160px;overflow-y: auto;">
          <span v-for="(item,index) in editForm.users" :key="index" class="userlinelist">{{item.realname}}</span>
          </div>
        </el-form-item>
        <el-form-item label="我的投票：">
          {{editForm.vo_ad!==''?editForm.vo_ad:'您还未投票'}}
        </el-form-item>
        <el-form-item label="投票结果：">
          <span v-for="(item,index) in newObj" :key="index"
                style="display: block">{{item.option}}:{{item.number}}</span>
        </el-form-item>
        <el-form-item label="其他结果：">
          <div v-if="otherObj.length==0">
            无
          </div>
          <div v-else>
            <span v-for="(item,index) in otherObj" :key="index" style="display: block">{{item.option}}:{{item.number}}</span>
          </div>
        </el-form-item>
        <!--<el-form-item label="投票选项：">-->
        <!--<el-radio v-model="radioName" :label="index" v-for="(item,index) in newObj">{{item.option}}</el-radio>-->
        <!--</el-form-item>-->
      </div>
      <div v-else>
        <el-form-item label="投票内容：" prop="name">
          {{editForm.vote_name}}
        </el-form-item>
        <el-form-item label="投票选项：">
          <el-radio v-model="radioName" :label="item.option" v-for="(item,index) in editForm.option">{{item.option}}
          </el-radio>
        </el-form-item>
        <el-form-item label="" v-if="radioName=='其他'">
          <el-input v-model="usersName" placeholder="请输入其他选择" type="textarea"></el-input>
        </el-form-item>
      </div>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click.native="handleClose" size="small">取消</el-button>
      <el-button type="primary" @click.native="editSubmit" size="small" v-if="pageType !== 1">提交</el-button>
    </div>
  </el-dialog>
</template>
<script>
  import api from '@/utils/api.js'

  export default {
    name: 'Dialog',
    props: ['visible', 'eidtId', 'pageType'],
    watch: {
      visible () {
        this.dialogVisible = this.visible
        console.log('pageType:', this.pageType, this.visible)
        if (this.visible) {
          let title = '投票详情'
          if (this.pageType == 2) {
            title = '参与投票'
          }
          this.tieleName = title
          this.InitFn()
        }
      }
    },
    data () {
      return {
        tieleName: '',
        dialogVisible: this.visible,
        editForm: null,
        editFormRules: {}, // 表单验证不能为空规则
        newObj: [],
        otherObj: [],
        editFormStatus: true,
        radioName: 0,
        flag: true,
        usersName: ''
      }
    },
    created () {
    },
    methods: {
      InitFn () {
        this.$fetch(api.vote_edit, {id: this.eidtId}).then((response) => {
          if (response.code === 0) {
            if (response.vo.is_input === 1) {
              response.vo.option.push({number: 0, option: '其他'})
            }
            this.radioName = response.vo.option[0].option
            this.newObj = response.options
            this.otherObj = response.other
            this.editForm = response.vo
          } else {
          }
        }).catch((err) => {
          console.log(err)
        })
      },
      // 提交数据
      editSubmit () {
        let option_ = this.radioName
        if (this.radioName === '其他') {
          option_ = this.usersName
        }
        let data_ = {id: this.eidtId, option: option_}
        if (this.flag) {
          this.flag = false
          this.$post(api.vote_attend, data_).then((response) => {
            if (response.code === 0) {
              this.$emit('initFile')
              this.handleClose()
              this.$message({
                message: '投票成功！',
                type: 'success'
              })
            } else {
              this.$message.error(response.msg)
            }
            this.flag = true
          }).catch((err) => {
            console.log(err)
          })
        }
      },
      // 关闭弹窗之前执行
      handleClose () {
        this.dialogVisible = false
      }

    }
  }
</script>

